#container {
	background-color: #3F8FD2;
	width: 738px;
	margin: auto;
	margin-top: 20px;
	height: 380px;
}

.hidden {
	display: none !important;
}

#roomList, #rightPanel {
	float: left;
	margin-left: 10px;
	
}

#rightPanel {
	width: 428px;
}

#roomList, #roomInfo, #createRoom {
	background-color: #eff;
	border: 1px solid black;
}

#roomList {
	width: 280px;
}

#roomInfo {
	height: 185px;
	margin-bottom: 10px;	
}

#joinRoom {
	padding: 10px;
	float: right;	
}

#createRoom {
	height: 110px;	
}

#tableWrapper {
	overflow: auto;
	height: 307px;	
}

#tableWrapper div {
	padding: 5px;
}

#header {
	padding: 20px;
	float: left;
	width: 96%;
}

#mainContent {
	clear: left;	
}

h1 {
	padding-left: 90px;
	text-align: center;	
	display: inline;
}

#options {
	float: right;
}

#options.guest {
	display: none;
}

h3 {
	float: left;
	padding: 10px;	
	text-align: left;
}

table {
	width: 100%;
	margin: auto;	
	float: left;
}

tr {
	padding: 2px;
	text-align: left;	
}

tr.roomItem:hover {
	background-color: #66A1D2;
}

tr.roomItem.selected {
	background-color: #8CA3FF;
}

td, th {
	padding: 3px;
	text-align: left;	
}

#createRoom label {
	width: 90px;
	float: left;
	text-align: left;
	padding-left: 10px;	
}

#createRoom label.error {
	padding-left: 10px;	
	width: 170px;
}

#createRoom input {
	width: 135px;
	float: left;	
}

#createRoom a {
	padding-left: 10px;
	float: left;
	clear: left;	
}

.formText {
	width: 100%;
	padding: 2px;
	clear: left;
}

#currentRoom {
	padding: 10px;
}

/* not connected box */

#noUser {
	display: none;
	background-color: #3F8FD2;
	width: 880px;
	margin: auto;
	margin-top: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
}

#noUser.unconnected {
	display: block;
}

/* user option */

#userDetailsHeader {
	padding: 10px;
	width: 96%;
	float: left;	
}

#userDetailsHeader a {
	float: right;	
}

#userDetailsContent {
	clear: left;
}

#userDetails {
	display: none;	
	width: 650px;
	height: 300px;
}

#userRankWrap {
	margin-bottom: 15px;	
}

#changeEmailForm {
	margin-bottom: 15px;	
}

#changePasswordForm {
	margin-bottom: 15px;	
}

#userDetails input.disabled {
	background-color: #eee;
	color: #000;
}

#userDetails .formText {
	padding-bottom: 20px;	
}

#userDetails label {
	width: 140px;
	float: left;
	text-align: left;
}

#userDetails label.error {
	padding-left: 10px;	
	width: 210px;
}

#userDetails input {
	width: 230px;
	float: left;	
}

#userDetails span {
	float: left;
}

#changePassword {
	clear: left;
	float: left;
}

#userChangePassword {
	padding-bottom: 5px;
	float: left;
	clear: left;	
}

#userDetails hr {
	border: 0;
	color: #000;
	background-color: #000;
	height: 1px;
	width: 100%;
}

#gameHistory {
	text-align: left;	
}

#gameHistory h2 {
	padding: 0px 0px 5px 3px;
	font-size: 14px;	
}

#gameHistoryTableWrapper {
	height: 200px;
	overflow: auto;	
}

#gameHistoryTableWrapper td {
	width: 200px;	
}


/*** Hall Of Fame ***/
#hallOfFame {
	width: 300px;
	height: 520px;
	display: none;	
}

#hallOfFame h1 {
	padding-right: 50px;
}

#viewHallOfFame {
	float: right;
	padding-right: 10px;	
}

.profilePic img {
	height: 39px;
	width: 39px;
}


/* misc */
#postOnWall {
	float: right;
	padding-right: 10px;		
}
